<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入样式重置表 -->
    <link rel="stylesheet" href="./css/reset.css">
    <!-- 移入公共样式表 -->
    <link rel="stylesheet" href="./css/common.css">
    <!-- 引入插件样式 -->
    <link rel="stylesheet" href="./css/slider.css">
    <!-- 引入当前样式表 -->
    <link rel="stylesheet" href="./css/red.css">
</head>
<body>
    <!-- 1、头部开始 -->
    <div id="header">
        <!-- 顶部 -->
        <div class="top bgc10 ce6">
            <!-- 版心 -->
            <div class="container ti210">
                <!-- 左边 -->
                legochina.cn
                <!-- 右边 -->
                <div class="fr">
                    欢迎光临<span class="cf60">乐购</span>，请<a href="#">登录</a>\<a href="#" class="cf60">注册</a>
                </div>
            </div>
        </div>
        <!-- 菜单 -->
        <div class="container rel">
            <!-- logo -->
            <a href="#"><img src="./imgs/logo.jpg" alt="" class="abs logo"></a>
            <!-- 搜索和购物车 -->
            <div class="clearfix" id="searchBox">
                <div class="shopCar fr tcenter fs16 mt5">
                    <a href="#" class="shopTxt fs14">购物车<span>0</span></a>
                    <a href="#">我的订单</a>
                </div>
                <!-- 搜索框 -->
                <form action="#" class="search fr clearfix mt5">
                    <input type="text" class="txt fl" placeholder="创意文具">
                    <input type="button" value="" class="btn fl">
                </form>
            </div>
            <!-- 主导航 -->
            <ul id="Navigation" class="clearfix">
                <li><a href="#">图书</a></li>
                <li><a href="#">电子书</a></li>
                <li><a href="#">原创文学</a></li>
                <li><a href="#">服装</a></li>
                <li><a href="#">户外运动</a></li>
                <li><a href="#">孕婴童</a></li>
                <li><a href="#">家居</a></li>
                <li><a href="#">创意文具</a></li>
                <li><a href="#">地方特产</a></li>
                <li><a href="#">海外购</a></li>
                <li><a href="#">电器城</a></li>
            </ul>
        </div>
    </div>































        <!-- 下边线 -->
    <div class="xiabianxian"></div>

    <!-- 10.页脚 -->
    <!-- 四个图标 -->
    <div id="footer">
        <div class="footerTop">
            <ul class="container">
                <li><a href="#"><img src="./imgs/222_11.png" alt=""></a></li>
                <li><a href="#"><img src="./imgs/222_13.png" alt=""></a></li>
                <li><a href="#"><img src="./imgs/222_15.png" alt=""></a></li>
                <li><a href="#"><img src="./imgs/222_17.png" alt=""></a></li>
            </ul>
        </div>
    <!-- 页脚列表 -->
        <div class="footerList container">
            <!-- 页脚第一排列表盒子 -->
            <div class="footerListBox">
                <ul class="container">
                    <script>
                        for (let i = 0; i < 5; i++) {
                            document.write(`
                            <li class="footerListText dib fl"><a href="#">购物指南</a></li>
                            `) 
                        }
                    </script>
                </ul>
            </div>
            <!-- 页脚第二排列表盒子 -->
            <div class="footerListBox2">
                <ul class="container Boxtwo">
                    <script>
                        for (let i = 0; i < 19; i++) {
                            document.write(`
                            <li class="footerListText2 dib fl"><a href="#">退换货政策</a></li>
                            `)
                        }
                    </script>
                    <li class="footerLogo">
                        <div>
                            <img src="./imgs/logo_00.png" alt="">
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 最后两排 -->
        <div class="footerBottom container">
            <p class="dib mg42 lh32 tcenter">公司简介  |  Investor Relations  |  网站联盟  |  乐购招商  |  机构销售  |  手机乐购  |  官方Blog   |  热词搜索<br>Copyright (C) 乐购网 2004-2016, All Rights Reserved</p>
        </div>
    </div>

    <!--轮播结束-->
    <script src="./lib/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
    <!--插件库-->
            <script src="./lib/slider.js" type="text/javascript" charset="utf-8"></script>
            <script src="./js/index.js"></script>
</body>
</html>